<template>
	<view class="x-main-content">
		<u-navbar bgColor="#fff" :fixed="true" leftIconColor="#333" leftIconSize="42rpx" autoBack placeholder
			:title="controlTitle">
		</u-navbar>
		<view class="main-info">
			<view class="main-content">
				<view class="content-item" style="color: #000;font-weight: 600;position: relative;">就诊人信息：
					<view style="position: absolute;right: 20rpx;font-size: 24rpx;font-weight: 400;color: #555;"
						v-if="controlCode=='edit'" @click="delInfo">
						删除
					</view>
				</view>
				<view class="content-item">
					<view>姓名</view>
					<view>
						<input type="text" placeholder="请输入就诊人真实姓名" class="content-input"
							placeholder-style="font-size:24rpx;color:#ababab" maxlength="15" v-model="patientName" />
					</view>
				</view>
				<view class="content-item">
					<view>电话号</view>
					<view class="content-input">
						<input type="text" placeholder="请输入就诊人手机号" class="content-input"
							placeholder-style="font-size:24rpx;color:#ababab" maxlength="11" v-model="patientPhone" />
					</view>
				</view>
				<view class="content-item">
					<view>性别</view>
					<view class="content-input" style="position: absolute;right: 136rpx;width: 200rpx;">
						<u-radio-group v-model="patientSex" style="width: 200rpx;">
							<u-radio v-for="(item,index) in lableList" :key="index" :label="item.name" :name="item.name"
								labelSize='24rpx' labelColor="#ababab" size='24rpx'
								style="margin-right: 40rpx;"></u-radio>
						</u-radio-group>
					</view>
				</view>
				<view class="content-item">
					<view>年龄</view>
					<view class="content-input">
						<input type="text" placeholder="请输就诊人真实入年龄" placeholder-style="font-size:24rpx;color:#ababab"
							maxlength="3" v-model="patientAge" />
					</view>
				</view>
				<view class="content-item">
					<view>身份证号</view>
					<view class="content-input">
						<input type="text" placeholder="请输就诊人身份证" placeholder-style="font-size:24rpx;color:#ababab"
							maxlength="18" v-model="patientIdCard" />
					</view>
				</view>
			</view>
			<view class="toConfirm">
				<view class="btn-confirm" @click="toInsert">
					确定
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				lableList: [{
						name: '男',
						disabled: true
					},
					{
						name: '女',
						disabled: false
					}
				],
				controlTitle: '',
				patientSex: '',
				patientName: '',
				patientPhone: '',
				patientAge: '',
				patientIdCard: '',
				controlCode: '',
				patientOrderId: ''
			}
		},
		onLoad(e) {
			let ctx = JSON.parse(decodeURIComponent(e.data))
			if (ctx == 'add') {
				this.controlCode = 'add'
				this.controlTitle = '添加新的就诊人'
			} else {
				console.log(ctx)
				this.controlCode = 'edit'
				this.controlTitle = '修改就诊人信息'
				this.patientName = ctx.name
				this.patientPhone = ctx.phone
				this.patientAge = ctx.age
				this.patientIdCard = ctx.idCard
				this.patientSex = ctx.sex
				this.patientOrderId = ctx.id
			}
		},
		methods: {
			async toInsert() {
				let params = {
					age: this.patientAge,
					name: this.patientName,
					phone: this.patientPhone,
					sex: this.patientSex,
					idCard: this.patientIdCard,
					userId: uni.getStorageSync('userId')
				}
				let flag = this.patientAge == '' || this.patientName == '' || this.patientPhone == '' || this
					.patientSex == '' || this.patientIdCard == '' ? true : false
				if (!flag) {
					//添加就诊人
					if (this.controlCode == 'add') {
						let res = await this.$request('/api/applet/insertVisitorAccompany', params, 'POST','type')
						console.log(res)
						this.getRequestData(res)

					} else {
						params.id = this.patientOrderId
						let res = await this.$request('/api/applet/changeVisitorAccompany', params, 'POST','type')
						this.getRequestData(res)
					}
				} else {
					uni.showModal({
						title: '提示',
						content: '请将内容填写完整！'
					})
				}

			},
			delInfo() {
				uni.showModal({
					title: '提示',
					content: '就诊人信息删除后无法恢复，确定要删除吗？',
					success: async res => {
						if (res.confirm) {
							let params = {
								id: this.patientOrderId
							}
							let res = await this.$request('/api/applet/deleteVisitorAccompany', params, 'GET')
							this.getRequestData(res)
						}
						if (res.cancel) {
							return
						}
					}
				})
			},
			getRequestData(res) {
				if (res.data.code == 200) {
					this.patientName = '',
						this.patientPhone = '',
						this.patientAge = '',
						this.atientIdCard = ''
					uni.showToast({
						title: '加载中',
						icon: 'loading',
						duration: 1000
					})
					this.$nextTick(() => {
						uni.navigateBack({
							delta: 1
						})
					})

				} else {
					uni.showToast({
						title: '网络错误',
						icon: 'none',
						duration: 1000
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main-info {
		margin-top: 60rpx;
		padding: 0 40rpx;

		.main-content {
			background-color: #fff;
			border-radius: 20rpx;

			.content-item {
				padding: 30rpx 20rpx;
				font-size: 28rpx;
				color: #555;
				display: flex;
				justify-content: space-between;
				align-items: center;

				.content-input {
					font-size: 24rpx;
					position: relative;


				}

				input {
					font-size: 24rpx;
					color: #ababab;
				}
			}
		}

		.toConfirm {
			position: fixed;
			width: 100%;
			bottom: 60rpx;
			left: 0;
			display: flex;
			justify-content: center;

			.btn-confirm {
				padding: 12rpx 0;
				background-color: #386fff;
				font-size: 28rpx;
				color: #fff;
				border-radius: 30rpx;
				letter-spacing: 1px;
				width: 600rpx;
				text-align: center;
			}
		}
	}

	/deep/.u-radio-group {
		justify-content: space-between;
	}
</style>